<template>
   <div>
    <van-nav-bar  left-text="返回" right-text="确定" title="添加机器人" left-arrow @click-left="returnBack"
            @click-right="submitRobot" />
            <van-field v-model="robotName" label="机器人名" placeholder="请输入机器人名" />
            <van-cell title="机器人类型" class="robotType">
            <!-- 使用 right-icon 插槽来自定义右侧图标 -->
            <template #right-icon>
                <van-dropdown-menu direction="up">
                    <van-dropdown-item v-model="imageRobotType" :options="imageRobotTypeList" />
            </van-dropdown-menu>

            </template>
        </van-cell>
   </div>
</template>

<script>
import {create} from '@/api/user/robotInfo'
export default {
  name: 'AddRobot',
  data () {
    return {
        imageRobotType: 1,
        robotName:'',
        imageRobotTypeList: [
            { text: 'chatGpt', value: 1 },
            { text: 'midjourney', value: 2 }
        ]
    }
  },
  components: {},
  computed: {},
  methods: {
    async submitRobot (){
        const robot ={
            robotName: this.robotName,
            robotType: this.robotType
        }
        const {data} = await  create(robot)
        console.log('submitRobot ', data)
        if(data.code === 200){
            this.$router.go(-1)
        }
    },
    returnBack (){
        this.$router.go(-1)
    },

  }
}
</script>

<style scoped lang='scss'>
.robotType {
    
    height: 44px;
    line-height: 20px;
   ::v-deep .van-dropdown-menu__bar {
        height: 30px;
        background-color: aliceblue;
    }
    ::v-deep  .van-dropdown-menu__title::after {
    display: none !important;
}
}
</style>
